<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
	<title>My first Chartist Tests</title>
	<link rel="stylesheet" th:href="@{/css/chartist/chartist.min.css}">
	<script type="text/javascript" th:src="@{/ajax/libs/chartist/dist/chartist.min.js}"></script>
</head>
<body>
	<!-- Site content goes here !-->
	<div class="ct-chart ct-perfect-fourth"></div>
</body>
<script type="text/javascript">
new Chartist.Bar('.ct-chart', {
	  labels: ['Q1', 'Q2', 'Q3', 'Q4'],
	  series: [
	    [800000, 1200000, 1400000, 1300000],
	    [200000, 400000, 500000, 300000],
	    [100000, 200000, 400000, 600000]
	  ]
	}, {
	  stackBars: true,
	  axisY: {
	    labelInterpolationFnc: function(value) {
	      return (value / 1000) + 'k';
	    }
	  }
	}).on('draw', function(data) {
	  if(data.type === 'bar') {
	    data.element.attr({
	      style: 'stroke-width: 30px'
	    });
	  }
	});

</script>
</html>
